/* eslint no-unused-vars:0 */
import React, { Component } from 'react';
import 'antd/dist/antd.css';
import './index.less';
import {
    Menu,
    Col,
    Row,
    Icon,
    Input,
    Select,
    Button,
    Table,
    Modal,
    Avatar,
    Layout
} from 'antd';
import PageComponent from './pageComponent.jsx';
import { Link } from 'react-router-dom';

const { Header, Footer, Sider, Content } = Layout;

export default class Solution extends React.Component {
    //点击翻页
    pageClick(pageNum) {
        var _this = this; //如果不定义就会出现作用域的问题this.setState不是一个函数
        if (pageNum != _this.state.current) {
            _this.state.current = pageNum;
        }

        _this.state.indexList = []; //清空之前的数据

        let temp = {
            type: _this.state.searchTypeInput,
            level: _this.state.searchLevelInput,
            pageSize: _this.state.pageSize,
            pageNum: _this.state.current - 1
        };

        console.log(_this.state.searchTypeInput);
        console.log(_this.state.searchLevelInput);
        console.log(temp);

        this.$get('/riskSolution/findAll', temp)
            .then((res) => {
                console.log(res);
                if (res) {
                    ///
                    _this.setState({ totalData: res.solutions.content });
                    _this.setState({ totalNum: res.solutions.totalElements });
                    //计算总页数= 总记录数 / 每页显示的条数
                    let totalPage = Math.ceil(
                        _this.state.totalNum / _this.state.pageSize
                    );
                    _this.setState({ totalPage: totalPage });

                    _this.state.indexList = []; //清空之前的数据
                    for (var i = 0; i < _this.state.pageSize; i++) {
                        if (_this.state.totalData[i]) {
                            _this.state.indexList.push(
                                _this.state.totalData[i]
                            );
                        }
                    }
                    _this.setState({ indexList: _this.state.indexList });
                }
            })
            .catch((e) => {
                console.log('error');
            });
    }

    //上一步
    goPrevClick() {
        var _this = this;
        let cur = this.state.current;
        if (cur > 1) {
            _this.pageClick(cur - 1);
        }
    }

    //下一步
    goNext() {
        var _this = this;
        let cur = _this.state.current;
        //alert(cur+"==="+_this.state.totalPage)
        if (cur < _this.state.totalPage) {
            _this.pageClick(cur + 1);
        }
    }

    // 跳转到指定页
    goSwitchChange(e) {
        var _this = this;
        _this.setState({ goValue: e.target.value });
        var value = e.target.value;
        // alert(value+"==="+_this.state.totalPage)
        if (!/^[1-9]\d*$/.test(value)) {
            alert('页码只能输入大于1的正整数');
        } else if (parseInt(value) > parseInt(_this.state.totalPage)) {
            alert('没有这么多页');
        } else {
            _this.pageClick(value);
        }
    }

    getList(pageNum = '0') {
        let temp = {
            pageSize: 5,
            pageNum: pageNum
        };
        this.$get('/riskSolution/findAll', temp)
            .then((res) => {
                console.log(res);
                this.setState({
                    data: res.solutions.content
                });
                console.log(res);
            })
            .catch((e) => {
                console.log(e);
            });
    }

    componentDidMount() {
        // this.getList();
        this.pageClick(1);
        this.getResumes();
    }

    handleOk(type) {
        if (type == 'solution') {
            this.setState({
                solutionVis: false
            });
        } else {
            this.setState({
                consultVisible: false
            });
        }
    }

    handleCancel(type) {
        if (type == 'solution') {
            this.setState({
                solutionVis: false
            });
        } else {
            this.setState({
                consultVisible: false
            });
        }
    }

    showSolutions(e, text) {
        this.setState({
            solutionVis: true,
            solutionsContent: text
        });
    }

    consultExport() {
        this.setState({
            consultVisible: true,
            consultText: '您好，欢迎咨询中山大学，电话13267869902'
        });
    }

    getResumes() {
        console.log('ggjj');
        this.$get('/riskSolution/findAdvisory')
            .then((res) => {
                console.log(res);
                this.setState({
                    resume: res.advisory
                });
            })
            .catch((e) => {
                console.log(e);
            });
    }

    state = {
        resume: [
            {
                name: '张三',
                phone: '10086',
                resume: '华工某某事件问题的解决者'
            },
            {
                name: '张三',
                phone: '10086',
                resume: '华工某某事件问题的解决者'
            },
            { name: '张三', phone: '10086', resume: '华工某某事件问题的解决者' }
        ],
        indexList: [], // 获取数据的存放数组
        totalNum: '', // 总记录数
        totalData: [],
        current: 1, //当前页码
        pageSize: 5, //每页显示的条数5条
        goValue: '',
        totalPage: '', //总页数
        searchTypeInput: '',
        searchLevelInput: '',
        data: [],
        columns: [
            {
                title: '事件',
                dataIndex: 'title',
                width: 340,
                render: (text, record) => (
                    <span
                        className={
                            record.referenceLevel.level == '重点参考'
                                ? 'tableColRed'
                                : record.referenceLevel.level == '一般参考'
                                ? 'tableColBlue'
                                : 'tableColGrey'
                        }>
                        {text}
                    </span>
                )
            },
            {
                title: '参考意见',
                dataIndex: 'referenceLevel.level',
                width: 200,
                render: (text) => (
                    <span
                        className={
                            text == '重点参考'
                                ? 'tableColRed'
                                : text == '一般参考'
                                ? 'tableColBlue'
                                : 'tableColGrey'
                        }>
                        {text}
                    </span>
                )
            },
            {
                title: '处理方案',
                dataIndex: 'content',
                width: 200,
                render: (text) => (
                    <a
                        onClick={(e) => this.showSolutions(e, text)}
                        type="default">
                        详情
                    </a>
                )
            }
        ],
        solutionVis: false,
        solutionsContent: '',
        consultVisible: false,
        consultText: ''
    };

    render() {
        return (
            <div className="body">
                <Row className="solution-row1">
                    <Button type="default">同类事件</Button>
                    <Button
                        type="primary"
                        onClick={this.consultExport.bind(this)}>
                        专家咨询
                    </Button>
                </Row>
                <br />
                <Row className="sub-row2">
                    <Table
                        className="emergency-table"
                        columns={this.state.columns}
                        dataSource={this.state.totalData}
                        pagination={false}
                    />
                    ,
                    <div style={{ float: 'right' }}>
                        <PageComponent
                            total={this.state.totalNum}
                            current={this.state.current}
                            totalPage={this.state.totalPage}
                            goValue={this.state.goValue}
                            pageClick={this.pageClick.bind(this)}
                            goPrev={this.goPrevClick.bind(this)}
                            goNext={this.goNext.bind(this)}
                            switchChange={this.goSwitchChange.bind(this)}
                        />
                    </div>
                </Row>
                <Modal
                    title="解決方案"
                    visible={this.state.solutionVis}
                    onOk={this.handleOk.bind(this, 'solution')}
                    onCancel={this.handleCancel.bind(this, 'solution')}
                    okText="确定"
                    cancelText="取消">
                    <p>{this.state.solutionsContent}</p>
                </Modal>

                <Modal
                    title="专家咨询"
                    visible={this.state.consultVisible}
                    onOk={this.handleOk.bind(this, 'consult')}
                    onCancel={this.handleCancel.bind(this, 'consult')}
                    okText="确定"
                    cancelText="取消"
                    width={750}>
                    <div>
                        <Layout className={'emergency-table'}>
                            <Layout style={{ lineHeight: '15px' }}>
                                <Sider width={160}>
                                    <img
                                        src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1555102158348&di=7181cf2458809bdbb48b9a0c028ca96c&imgtype=0&src=http%3A%2F%2Fall.cfej.net%2Fuploads%2Fallimg%2F190328%2F1122253I4-0.jpg"
                                        width="150px"
                                    />
                                </Sider>
                                <Content width={200}>
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;姓名：
                                    {this.state.resume[0].name}
                                    <br />
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;电话：
                                    {this.state.resume[0].phone}
                                    <br />
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;案例：
                                    <span>{this.state.resume[0].resume}</span>
                                    <br />
                                    <br />
                                    <br />
                                </Content>
                                <Sider width={160}>
                                    <img
                                        src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1555102158348&di=7181cf2458809bdbb48b9a0c028ca96c&imgtype=0&src=http%3A%2F%2Fall.cfej.net%2Fuploads%2Fallimg%2F190328%2F1122253I4-0.jpg"
                                        width="150px"
                                    />
                                </Sider>
                                <Content width={200}>
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;姓名：
                                    {this.state.resume[1].name}
                                    <br />
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;电话：
                                    {this.state.resume[1].phone}
                                    <br />
                                    <br />
                                    <br />
                                    &nbsp; &nbsp;&nbsp;案例：
                                    {this.state.resume[1].resume}
                                    <br />
                                    <br />
                                    <br />
                                </Content>
                            </Layout>
                        </Layout>
                        <br />
                        <Layout style={{ lineHeight: '15px' }}>
                            <Sider width={160}>
                                <img
                                    src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1555102158348&di=7181cf2458809bdbb48b9a0c028ca96c&imgtype=0&src=http%3A%2F%2Fall.cfej.net%2Fuploads%2Fallimg%2F190328%2F1122253I4-0.jpg"
                                    width="150px"
                                />
                            </Sider>
                            <Content width={200}>
                                <br />
                                <br />
                                &nbsp; &nbsp;&nbsp;姓名：
                                {this.state.resume[2].name}
                                <br />
                                <br />
                                <br />
                                &nbsp; &nbsp;&nbsp;电话：
                                {this.state.resume[2].phone}
                                <br />
                                <br />
                                <br />
                                &nbsp; &nbsp;&nbsp;案例：
                                {this.state.resume[2].resume}
                                <br />
                                <br />
                                <br />
                            </Content>
                        </Layout>
                    </div>
                </Modal>
            </div>
        );
    }
}
